new Vue({
  el: '#about_us',
  components: {},
  data: {
    news: [],
    getNews: [],
    showButton: 1,
    pageNum: 1,
    dataLength: 1,
    beginNum: 3, //刚开始显示的新闻的数量
    screenWidth: '', //屏幕宽
    screenHeight: '', //屏幕高
    backgroundSize: [], //背景的大小
    backgroundNum: 1, //背景图片的数量
    showToTop: false,
  },
  computed: {},
  mounted() {
    var that = this;
    this.screenWidth = document.body.clientWidth;
    this.screenHeight = document.body.clientHeight;
    if (this.screenWidth > 658 && this.screenWidth < 991) that.beginNum = 2;
    else that.beginNum = 3;
    axios.get('http://dl.sword.ink:2334/introducep/0').then((res) => {
      var listData = JSON.parse(JSON.stringify(res.data.data));
      that.dataLength = listData.length;
      that.pageNum = listData[that.dataLength - 1].id; //用于下一次获取数据
      var i;
      for (i = 0; i < listData.length; i++) {
        if (listData[i].updateTime != undefined)
          listData[i].updateTime = listData[i].updateTime.substring(0, 10);
        let img = new Image();
        img.src = listData[i].picture;
        img.onload = function () {
          if (img.width / img.height >= 373 / 277) {
            that.backgroundSize.push('auto 100%');
          } else {
            that.backgroundSize.push('100% auto');
          }
        };
      }
      // listData是规范时间之后的数据
      that.getNews = listData;
      var list = JSON.parse(JSON.stringify(that.getNews));
      list.splice(that.beginNum, list.length - that.beginNum);
      that.news = list; //三个或两个数据
    });
    window.onresize = () => {
      return (() => {
        this.screenWidth = document.body.clientWidth;
        this.screenHeight = document.body.clientHeight;
        //还没有点击更多新闻的时候
        if (this.screenWidth <= 658) that.beginNum = 1;
        else if (this.screenWidth > 658 && this.screenWidth < 991)
          that.beginNum = 2;
        else that.beginNum = 3;
        // console.log(this.screenWidth);
        if (that.showButton == 1) {
          //没有展开
          if (this.screenWidth <= 658) that.beginNum = 3;
          var list = JSON.parse(JSON.stringify(that.getNews));
          list.splice(that.beginNum, list.length - that.beginNum);
          that.news = list; //三个或两个数据
          var i;
        } else {
          that.news = [];
          that.news = JSON.parse(JSON.stringify(that.getNews));
          // console.log(that.news);
          for (i = 0; i < that.news.length; i++) {
            that.news.yes = 'visibility:visible';
          }
          //如果当前数据不是一行的整倍数就添加数据
          var s =
            (that.beginNum - (that.news.length % that.beginNum)) %
            that.beginNum;
          for (i = 0; i < s; i++) {
            that.news[that.news.length] = {};
            that.news[that.news.length - 1].yes = 'visibility:hidden';
          }
        }
      })();
    };

    this.scroll();
  },
  methods: {
    getHref(id, index) {
      var x = '#about_us a[' + 'id =' + index + ']';
      var a = $(x);
      a[0].setAttribute('href', './contact.html?id=' + id);
    },
    scroll() {
      var that = this;
      window.onscroll = () => {
        if (window.scrollY > 5) that.showToTop = true;
        else that.showToTop = false;
        let bottomOfWindow =
          document.documentElement.scrollTop + window.innerHeight >=
          document.documentElement.offsetHeight - 20;
        if (
          this.showButton == false &&
          bottomOfWindow &&
          this.showButton != 1
        ) {
          this.waitY();
          this.waitR();
          // setTimeout(function () {
          //   that.waitR();
          //   that.waitN();
          // }, 500);
        }
      };
    },
    waitY() {
      this.showButton = 2;
    },
    waitR() {
      var that = this;
      axios
        .get('http://dl.sword.ink:2334/introducep/' + that.pageNum)
        .then((res) => {
          if (res.data.data[0] == undefined) this.Nwait();
          else {
            if (res.data.data.length < 6) this.Nwait(); //不会有下一次获取数据了
            var listData = JSON.parse(JSON.stringify(res.data.data));
            var i;
            for (i = 0; i < listData.length; i++) {
              if (listData[i].updateTime != undefined)
                listData[i].updateTime = listData[i].updateTime.substring(
                  0,
                  10
                );
              let img = new Image();
              img.src = listData[i].picture;
              img.onload = function () {
                if (img.width / img.height >= 373 / 277) {
                  that.backgroundSize.push('auto 100%');
                } else {
                  that.backgroundSize.push('100% auto');
                }
              };
            }
            // listData是规范时间之后的数据
            for (i = 0; i < listData.length; i++) {
              that.getNews[i + that.dataLength] = listData[i];
            }
            that.dataLength += listData.length;
            that.pageNum = listData[listData.length - 1].id; //用于下一次获取数据
            that.news = JSON.parse(JSON.stringify(that.getNews));
            for (i = 0; i < that.news.length; i++) {
              that.news.yes = 'visibility:visible';
            }
            //如果当前数据不是一行的整倍数就添加数据
            var s =
              (that.beginNum - (that.news.length % that.beginNum)) %
              that.beginNum;
            // console.log(that.beginNum);
            // console.log(that.news.length);
            for (i = 0; i < s; i++) {
              that.news[that.news.length] = {};
              that.news[that.news.length - 1].yes = 'visibility:hidden';
            }
            that.waitN();
          }
        });
    },
    waitN() {
      this.showButton = false;
    },
    Nwait() {
      this.showButton = 3;
    },
    change() {
      this.news = JSON.parse(JSON.stringify(this.getNews));
      this.showButton = false;
      var s =
        (this.beginNum - (this.news.length % this.beginNum)) % this.beginNum;
      for (i = 0; i < s; i++) {
        this.news[this.news.length] = {};
        this.news[this.news.length - 1].yes = 'visibility:hidden';
      }
    },
  },
});
